import { FC } from 'react';
import { Image } from 'antd';

interface ImgPreviewProps {
  visible: boolean;
  previewIndex: number;
  previewData: any[];
  onClose: () => void;
}

export const ImgPreview: FC<ImgPreviewProps> = ({
  visible,
  previewData,
  previewIndex = 0,
  onClose
}) => {

  return (
    <Image.PreviewGroup preview={{
      visible,
      current: previewIndex,
      onVisibleChange: onClose
    }}>
      {
        previewData.map(({ fileUrl }: any) => {
          return (
            <Image
              width={200}
              style={{ display: 'none' }}
              src={fileUrl}
            />
          )
        })
      }
    </Image.PreviewGroup>
  );
};
